<template>
  <div id="mi_shop">
  <div id="flash">
  <div id="mi_content">
     <div class="row">
        <!--左箭头。如果放置在swiper-container外面，需要自定义样式。-->
        <div class="swiper-button-prev" slot="button-prev"></div>
         <!--右箭头。如果放置在swiper-container外面，需要自定义样式。-->
        <div class="swiper-button-next" slot="button-next"></div
     <div id="title_icon">
       <h1>小米闪购</h1>

     </div>


      <div class="flashsale" id="div1">
         <div class="clock">
           14:00 场
         </div>
          <el-image src="data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAA1CAYAAAAklDnhAAAAGXRFWHRTb2Z0d2                         FyZQBBZG9iZSBJ
                        bWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdp
                        bj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6
                        eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1
                        MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJo
                        dHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlw
                        dGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAv
                        IiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RS
                        ZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpD
                        cmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5j
                        ZUlEPSJ4bXAuaWlkOjY4Q0ZFMkY5MTJFNzExRThCMkM4OEM1RTNBNjczQUVBIiB4bXBNTTpEb2N1
                        bWVudElEPSJ4bXAuZGlkOjY4Q0ZFMkZBMTJFNzExRThCMkM4OEM1RTNBNjczQUVBIj4gPHhtcE1N
                        OkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NjhDRkUyRjcxMkU3MTFFOEIy
                        Qzg4QzVFM0E2NzNBRUEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NjhDRkUyRjgxMkU3MTFF
                        OEIyQzg4QzVFM0E2NzNBRUEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94Onht
                        cG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5oEyacAAACoklEQVR42sSYv0tbURTHX0LqD6T4g4pE
                        cHDoUOloBxVd/QFFEcQqWtrSKlKFmmAslopohzgIbv4FwUEE0clFujiIi+BSIbRQ0ooKRReRULHf
                        S48Qgu++c3/FAx+iyU3eJzf3nnPuC/1qavQ04zVY8szjCHRGNN9cBD6DSkOJKzAGzsOaH/AW1FuY
                        jRg4EH/oiJSCTxYk1sDK7T86Iu9BraHED/Au9wlVkYdg2lAiC/rBhYnIB/DIUOQj2M9/UkWkCsQN
                        JbbA8l0vqIhMgXIDiZ/gFbgxEakBEwYSf8Eg+OM3gCsyA8oMRETy25UN4IjUgVEDiW2wGDSIIzIL
                        ijUljsFLv3WhIvKYFphOXNO6OOUMDhKZA7qFcQF85Q6WXeQpeKEpcULlvY8xthp8iwR8I93qLLb7
                        KnOsSPWNfhd6Bro99yHqTi9IhyWzEXIsIXbSG7Djt1jbQHsBZkMkyZRs13wpgIRoiJKy7dsBWh1L
                        bN5Vt3JFQrQ2XMYeGKBk5yvSI7aRQ4k0eA4uZZlVPM47lDgTZxd6lKb4AcqkLuKSZiIdVGsiVFNc
                        xDV9yT1Orekjoe+MDw4pHqwmaJewit66Ql0QaX+DOTaZe4DitAFZxQaaEynKnJ6KCDeaQAtj3A7V
                        kBtXIpwT3iFV06zqquaKPKEtKIsM6Mo/StoWiQeMvSCJjO4+54hEwTCjuTk0STgckUm6QxTY3LgU
                        Kc+/jyFrblyKCIkKbnPjSkT8HDGV5saVyBAtVHZz40Ik7HNTRtrcuBARF2tQbW5ciCR0mhvbIs2E
                        cnNjWySh29zYFGnIK25KzY1Nkdziptzc2BKJUu7Qbm5sicQom2o3NzZEKqiu/DZpbmyIjIAHNBMZ
                        7x4iTALjhcgVQSIl3v87w5vePcY/AQYAFYR6skFSqBUAAAAASUVORK5CYII=">
         </el-image>
         <div class="clockend">距离结束还有</div>
         <div class="time">
            <span>00</span>:<span>00</span>:<span>00</span>
         </div>
      </div>
		 <!-- flashgou -->

     <!-- 小米闪购 -->


      <swiper class="swiper" ref="mySwiper" :options="swiperOptions">
       <swiper-slide>
          <ul  v-for="item in img1" :key="item.id">
           <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

           <li id="div2">
            <a href="#">
               <img :src="item.url"  alt="自动折叠伞 黑"/>
               <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
               <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
               <p class="price">
                 <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                 <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
               </p>
             </a>
           </li>

           <li id="div2">
            <a href="#">
               <img :src="item.url"  alt="自动折叠伞 黑"/>
               <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
               <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
               <p class="price">
                 <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                 <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
               </p>
             </a>
           </li>

           <li id="div2">
            <a href="#">
               <img :src="item.url"  alt="自动折叠伞 黑"/>
               <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
               <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
               <p class="price">
                 <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                 <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
               </p>
             </a>
           </li>
          </ul>
       </swiper-slide>

         <swiper-slide>
           <ul  v-for="item in img3" :key="item.id">
             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>
           </ul>
         </swiper-slide>
         <swiper-slide>
           <ul  v-for="item in img2" :key="item.id">
             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>
           </ul>
         </swiper-slide>
         <swiper-slide>
           <ul  v-for="item in img3" :key="item.id">
             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>
           </ul>
          </swiper-slide>
         <swiper-slide>
          <ul  v-for="item in img4" :key="item.id">
             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

             <li id="div2">
              <a href="#">
                 <img :src="item.url"  alt="自动折叠伞 黑"/>
                 <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                 <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                 <p class="price">
                   <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                   <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                 </p>
               </a>
             </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>

            <li id="div2">
             <a href="#">
                <img :src="item.url"  alt="自动折叠伞 黑"/>
                <h3 class="title" style="font-size: 15px;color: #000000;">{{item.title}}</h3>
                <p class="desc" style="font-size: 10px;color: #d4d4d4;">{{item.desc}}</p>
                <p class="price">
                  <span style=" font-size: 15px;color: #ff6700;"> {{item.price}}元</span>
                  <del  style="font-size: 15px;color: #d4d4d4;">{{item.price_te}}元</del>
                </p>
              </a>
            </li>
           </ul>
          </swiper-slide>



        </swiper>

<!-- row -->
  </div>
  </div>

  </div>
  </div>

 </div>
</template>

<script>

  export default{
    name: 'Mi_shangou',
    data(){
      return{
        // 照片数组
        img1:[
          {
            id: "01",
            title: "自动折叠伞 黑",
            url: "http://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1508311018.31143247.jpg?thumb=1&w=200&h=200",
            desc: "防泼水伞布，轻盈拒水",
            price: 89,
            price_te: 99
          }
        ],

        img2:[
          {
            id: "02",
            title: "RedmiBook 14 I5/8G/512G SATA/MX250 银色",
            url: "http://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1566878924.36539833.jpg?thumb=1&w=200&h=200",
            desc: "十代酷睿更强劲",
            price: 3999,
            price_te: 4499
          }
        ],

        img3:[
          {
            id: "02",
            title: "米家扫拖一体机器人 白色",
            url: "http://cdn.cnbj1.fds.api.mi-img.com/mi-mall/4a55139929717c6a286043d2bd82c728.jpg?thumb=1&w=200&h=200&f=webp&q=90",
            desc: "扫得干净，拖得彻底",
            price: 1499,
            price_te: 1999
          }
        ],

        img4:[
          {
            id: "02",
            title: "小米米家电动滑板车1S 白色",
            url: "http://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1586937333.45342874.jpg?thumb=1&w=200&h=200",
            desc: "型出格，行出色",
            price: 1899,
            price_te: 1999
          }
        ],

        img5:[
          {
            id: "02",
            title: "米家手持挂烫机 白色",
            url: "http://cdn.cnbj0.fds.api.mi-img.com/b2c-shopapi-pms/pms_1588141296.4258865.jpg?thumb=1&w=200&h=200",
            desc: " 快速除皱，即熨即穿",
            price: 109,
            price_te: 129
          }
        ],

        swiperOptions: {
         autoplay: {
            delay: 2000,
            disableOnInteraction: false,
            },
            // 是否循环
          loop: false,
          // 左右切换箭头
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          },
        }
      }
    },
	// 计算机属性
    computed:{
      swiper() {
              return this.$refs.mySwiper.$swiper
            }
    },
    mounted() {
      console.log('Current Swiper instance object', this.swiper)
      this.swiper.slideTo(1, 3000, true)
    }

  }
</script>

<style lang="less" scoped>
	#flash{
		width: 1580px;
    margin:  0 auto;
    position: relative;
	}
  #mi_shop{
    margin-top: 20px;


    background-color: #f5f5f5;

  }

  #title_icon{
    display: flex;
    justify-content: space-between;

  }
  #title_icon  h1{
    line-height: 58px;
    font-weight: 10;
    float: left;
    font-size: 25px;
  }

  #title_icon  i{

    text-align: center;
    width: 40px;
    height: 20px;
    border: 1px solid #000000;
  }
  #title_icon  div{
     padding-top: 20px;
     display: flex;
     cursor: pointer;
  }

  .flashsale span{
    margin: 4px;
    padding: 8px;
    height: 40px;
    width: 40px;
    color: #FFFFFF;
    font-size: 25px;
    background-color: #605751;
  }
  .flashsale .el-image{
    width: 34px;
    height: 53px;
  }
  .time{
    font-size: 50px;
  }
  .clock{
    color: #e53934;
    font-size: 20px;
  }
  .clockend{
    color: #b1aeaa;
  }

  #div1{
    width: 234px;
    height: 340px;
    border-top: 1px solid #e53935;
    background-color: #f1eded;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    float: left;
    z-index: 40;
  }

  #div2{
    width: 234px;
    height: 340px;
    // margin: 0 30px;
    border-top: 1px solid #e53935;
    background-color: #ffffff;
    float: left;
  }
  .swiper li{
    list-style: none;
  }
  .swiper a{
    width: 100%;
    height: 100%;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
  }

  .swiper ul {
    display: flex;
    justify-content: space-between;
  }

  .swiper-button-prev{
    border: 1px solid #ff007f;
    z-index: 100;
    position: absolute;
    padding: 3px 10px;
    top: 15px;
    left: 1500px;
    --swiper-theme-color: #ff6600;
    --swiper-navigation-size: 20px;
    }

 .swiper-button-next{
     border: 1px solid #ff0000;
      z-index: 100;
      position: absolute;
      top: 15px;
      left: 1546px;
      padding: 3px 10px;
     --swiper-theme-color: #ff6600;
     --swiper-navigation-size: 20px;
     }





</style>
